{% extends "mturk/base_fixed.html" %}
{% load humanize %}
{% load compress %}

{% block css %}{{ block.super }}
<style>
	#mt-top-padding { height: 40px; }
	#mt-top-flat { padding: 2px 10px 2px 10px; }
	#hdr-type { display:inline; margin-right: 50px; }
	#hdr-color { margin-bottom: 0px; }
	body { padding: 0px; }
</style>
{% endblock %}

{% block content %}
<div id="mt-top">
	<div id="mt-instructions">
		<span>Instructions: click on {{ min_points|apnumber }} white or gray thing{{ min_points|pluralize }} in the image.  Click on a point to remove it.  This is image <span id="image-index">1</span> of {{ num_contents }}.</span>
		<span class="pull-right">
			<a href="#modal-instructions" role="button" class="btn" data-toggle="modal">Instructions</a>&nbsp;
			<button type="button" id='btn-none' class="btn btn-primary">There are no more white things</button>&nbsp;
			<button type="button" id='btn-submit' class="btn btn-primary" disabled="disabled">Submit</button>
		</span>
	</div>
</div>
<div id="mt-top-padding"></div>

<div id="mt-container"></div>
{% endblock content %}


{% block modals %}{{ block.super }}
{% endblock modals %}


{% block scripts %}{{ block.super }}
{% include "photos/experiments/photos_content_script.html" %}
{% include "photos/experiments/photos_preload_script.html" %}

<script type="text/javascript">
window.min_points = {{ min_points }};
</script>

<script type="text/javascript" src="{{ STATIC_URL }}js/kinetic-v4.4.0.min.js"></script>
{% compress js %}
<script type="text/javascript" src="{{ STATIC_URL }}js/array_remove.js"></script>
<script type="text/coffeescript" src="{{ STATIC_URL }}js/common/util.coffee"></script>
<script type="text/coffeescript" src="{{ STATIC_URL }}js/common/modals.coffee"></script>
<script type="text/coffeescript" src="{{ STATIC_URL }}js/common/geom.coffee"></script>
<script type="text/coffeescript" src="{{ STATIC_URL }}js/common/active_timer.coffee"></script>
<script type="text/coffeescript" src="{{ STATIC_URL }}js/mturk/submit.coffee"></script>
<script type="text/coffeescript" src="{{ STATIC_URL }}js/photos/experiments/label_whitebalance.coffee"></script>
{% endcompress %}
{% endblock %}

